<template>
  <page-header-wrapper :title="false" >
    <a-card :body-style="{padding: '24px 32px'}" :bordered="false">
      <a-form @submit="handleSubmit" :form="form">
        <a-form-item
          label="调往柜组"
          :labelCol="{lg: {span: 7}, sm: {span: 7}}"
          :wrapperCol="{lg: {span: 10}, sm: {span: 17} }">
          <a-select v-decorator="['counterId']" placeholder="请选择调往柜组" >
            <a-select-option :value="i.value" v-for="i in option" :key="i.value">{{ i.label }}</a-select-option>
          </a-select>
        </a-form-item>
        <a-form-item
          :wrapperCol="{ span: 24 }"
          style="text-align: center"
        >
          <a-button htmlType="submit" type="primary" icon="check">下一步</a-button>
          <!-- <a-button style="margin-left: 8px">{{ $t('form.basic-form.form.save') }}</a-button> -->
        </a-form-item>
      </a-form>
    </a-card>
  </page-header-wrapper>
</template>
    
  <script>
  import { getStCounterListUsingPOST } from '@/api/api/mendianguanli.ts'
    export default {
      name: 'CounterShiftDetails',
      data () {
        return {
          form: this.$form.createForm(this),
          option:[],
          optionParam: {
            pageNo:1,
            pageSize:10,
            queryCondition:'',
            storeId: this.$route.params.id,
            status:1
          },
        }
      },
    mounted(){
      this.getOption()
    },
      methods: {
        getOption () {
          getStCounterListUsingPOST(this.optionParam).then((res) => {
          this.option = res.data.list.map((item)=>{
            return {
              label:item.counterName,
              value:item.id
            }
          })
        })
        .catch((error) => {
          this.$message.error(((error.response || {}).data || {}).msg || '请求出现错误')
        })
      },
        // handler
        handleSubmit (e) {
          e.preventDefault()
          this.form.validateFields((err, values) => {
            if (!err) {
              if(!values.counterId){
                this.$message.warn('请选择柜组')
              }else{
                this.$router.push({ name: `CounterShiftId` , params: {counterId: values.counterId,inStore: this.$route.params.id}  })  
              }
              // console.log('Received values of form: ', values)
            }
          })
        }
      }
    }
  </script>